<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
    xmlns:th="http://www.thymeleaf.org">
<head th:include="_header_include::frag(~{::title},~{},~{::style})">
	<title>修改角色</title>
    <style>
        .role-table {
            border: 1px solid #e0e0e0;
            border-bottom: none;
            padding: 0;
            position: relative;
            background: #efefef;
        }
        .role-table ul{background:#fff;}
        .header {
            height: 50px;
            line-height: 50px;
            border-bottom: 1px solid #e7e7e7;
            background: #F8F8F9;
            text-align: center;
            font-size: 16px;
        }

        .vertical-line {
            width: 1px;
            height: 100%;
            background: #ddd;
            position: absolute;
            left: 30%;
            top: 0;
            z-index: 1;
        }
        .vertical-line1 {
            width: 1px;
            height: 100%;
            background: #ddd;
            position: absolute;
            left: 80%;
            top: 0;
            z-index: 1;
        }

        .left {
            width: 28%;
            float: left;
            user-select: none;
            cursor: pointer;
            padding:20px 0;
            padding-left: 2%;
        }
        .header .left{padding:0;width: 30%;}
        .one {
            padding-left: 20px;
        }

        .right {
            width: 48%;
            float: left;
            padding:20px 0;
            padding-left: 2%;
        }
        .header .right{padding:0;width: 50%;}
        .handle{
            width: 20%;
            float: left;
            text-align: center;
            margin-top: 15px;
        }
        .header .handle{margin: 0;}
        .item-icon {
            margin-left: -5px;
            padding: 5px;
        }

        .line {
            clear: both;
            width: 100%;
            height: 1px;
            background: #e0e0e0;
        }
        [v-cloak] {
            display: none;
        }
        .checkAllBtn .el-checkbox__inner{margin-top: 15px;}
        .firstCheckAllBtn{position: absolute;left: 10px;top: 20px; }
    </style>
</head>
<body>
<div id="addRole" class="mainPadding" style="display: none;">  
    <el-breadcrumb separator="/" class="elBreadcrumb marginB20">
        <el-breadcrumb-item>Home</el-breadcrumb-item>
        <el-breadcrumb-item>系统管理</el-breadcrumb-item>
        <el-breadcrumb-item><a href="JavaScript:void(0)" data-url="roleManagePage.html">角色管理</a></el-breadcrumb-item>
    </el-breadcrumb>
    <el-row class="mainWhiteBg">
        <div class="inforTitle">修改角色</div>
        <el-form :model="addRoleValidateForm" :rules="rules"   maxlength="30" ref="addRoleValidateForm" label-width="100px" class="demo-ruleForm mainWhitePadding">
            <el-form-item
                label="角色名称："
                prop="roleName"
                style="width:400px;">
                <el-input v-model="addRoleValidateForm.roleName" autocomplete="off"></el-input>
            </el-form-item>
            <el-form-item
                label="角色编码："
                prop="roleCode"
                style="width:400px;">
                <el-input v-model="addRoleValidateForm.roleCode" disabled="disabled"   maxlength="30" autocomplete="off"></el-input>
            </el-form-item>
            <el-form-item label="访问IP限制：">
                <el-radio-group v-model="addRoleValidateForm.visitLimitRadio" @change="visitLimitRadioChange">
                    <el-radio label="0">开放访问</el-radio>
                    <el-radio label="1">限制IP访问</el-radio>
                </el-radio-group>
                <el-button type="primary" size="medium" class="marginL20" @click="openIpPackDilog" v-show="isDisabled">选择访问IP包</el-button>
                <!-- <el-button type="primary" size="medium" class="marginL20" @click="dialogFormSetting = true">设置</el-button> -->
            </el-form-item>
            <el-row v-show="isDisabled">
            	<div class="fs16 marginB20"><div class="titleBorderL">已选访问IP包</div></div>
            </el-row>
            <el-row v-show="isDisabled">
                <el-table 
                    style="width: 100%"
                    border
                    :data="ipListTable" 
                    >
                    <el-table-column align="center" prop="id"  type="index" label="序号" width="55"></el-table-column>
                    <el-table-column align="center" prop="name" label="IP包名"></el-table-column>
                    <el-table-column align="center" prop="ipAddress" label="IP地址"></el-table-column>
                    <el-table-column align="center" label="操作">
                        <template slot-scope="scope">
                            <el-button
                                @click.native.prevent="deleteRow(scope.$index, ipListTable)"
                                type="text">
                                                                                            删除
                            </el-button>
                        </template>
                    </el-table-column>
                </el-table>
            </el-row>
            <div class="fs16 marginB20 paddingT20">设定每个模块的权限</div>
                       
            <!-- 树形表格 -->
            <ul class="role-table col-xs-offset-2 col-md-offset-1 col-sm-offset-2 marginB20">
                <li class="header">
                    <div class="left"><el-checkbox v-model="checkAll1" @change="handleCheckAllChange1">全选</el-checkbox>&nbsp;&nbsp;&nbsp;&nbsp;模块菜单</div>
                    <div class="right">操作权限</div>
                    <div class="handle">数据权限</div>
                </li>
                <div class="vertical-line"></div>
                <div class="vertical-line1"></div>
                <li  v-for="(item,index) in dataList" :key="item.id" style="position: relative;">
                    <div class="left"  @click="fold(item)">
                        <i :class="{'el-icon-caret-right':item.folded,'el-icon-caret-bottom':!item.folded}" v-cloak v-if="item.subList" class="item-icon"></i>   
                        <el-checkbox @change="handleOneCheckAll(item)" v-cloak v-if="!item.subList" :indeterminate="item.isIndeterminate" v-model="item.checkAll"> {{item.title}}</el-checkbox>
                        <span v-if="item.subList" v-cloak>{{item.name}}</span> 
                    </div>              
                    <div class="right">
                    	<el-checkbox v-if="item.subList" :indeterminate="item.isIndeterminate" @change="checkSecondAll(item)" v-model="item.firstCheckAll" class="firstCheckAllBtn"></el-checkbox>                 
                        <el-checkbox-group v-model="item.checkedCities" @change="handleOneCheckedCitiesChange(item)" v-else>
                        <el-checkbox  v-for="m in item.operationInfos" :label="m.id" :key="m.id" v-cloak> {{m.name}}</el-checkbox>
                        </el-checkbox-group>
                    </div>
                    <div class="line"></div>
                    <ul v-show="item.subList&&!item.folded">
                        <li v-for="(subList,cur) in item.subList" :key="subList.id">
                            <div class="left">
                                <el-checkbox   v-model="subList.checkAll" @change="handleCheckAllChange(item,subList)" v-cloak>
                                    {{subList.name}}
                                </el-checkbox>
                            </div>
                            <div class="right">
                                <el-checkbox-group v-model="subList.checkedCities" @change="handleCheckedCitiesChange(item,subList)">
                                    <el-checkbox v-for="p in subList.operationInfos" :label="p.id" :key="p.id" v-cloak >
                                        {{p.name}}
                                    </el-checkbox>
                                </el-checkbox-group>
                            </div>
                            <div class="handle">
                                <el-button type="primary" size="small" class="marginL20" @click="openDialogLimitData(subList.authCode,subList.id)">设置</el-button>
                            </div> 
                            <div class="line"></div>                        
                        </li>
                    </ul>
                </li>
            </ul>
            <el-form-item style="text-align: center;">
                <el-button type="primary" :disabled="btnDisabled" @click="submitFormRole('addRoleValidateForm')">提交</el-button>
                <el-button @click="reBackRoleInfo">取消</el-button>
            </el-form-item>
        </el-form>
    </el-row>
    <!-- dialog -->
    <el-dialog title="选择IP包" :visible.sync="dialogFormChooseIP" @opened="queryIpPackgeData">
        <el-form :model="chooseIpform" :rules="rulesChooseIp" ref="chooseIpform">
            <el-row class="marginB10 greybg padding20">
                <el-row :gutter="20">
                    <el-col :span="6">
                   <el-form-item prop="ipPackageName">
                        <el-input v-model="chooseIpform.ipPackageName" placeholder="输入IP包名查询"></el-input>
                     </el-form-item>
                    </el-col>
                    <el-col :span="6">
                     <el-form-item prop="searchHasIp">
                         <el-input v-model="chooseIpform.searchHasIp" placeholder="输入包含IP查询"></el-input>
                      </el-form-item>
                    </el-col>
                    <el-col :span="2">
                        <el-button type="primary" size="medium"  @click="queryIpPackgeData" icon="el-icon-search">搜索</el-button>
                    </el-col>
                </el-row>
            </el-row>
            <el-table 
                tooltip-effect="dark"
                style="width: 100%"
                border
                :data="dataTableIP"
                @selection-change="changeIpTableFun"
                class="marginB10">
                <el-table-column align="center" v-model="chooseIpform.type" prop="id"  @selection-change="changeIpTableFun" type="selection" width="55"></el-table-column>
                <el-table-column align="center" prop="name" label="IP包名" width="155"></el-table-column>
                <el-table-column align="center" prop="ipAddress" label="IP地址"></el-table-column>
            </el-table>
            <el-form-item class="f-tac">
                <el-button type="primary" @click="submitIpPackeageForm('chooseIpform')">提交</el-button>
                <el-button @click="dialogFormChooseIP = false">取消</el-button>
            </el-form-item>
        </el-form>        
    </el-dialog>        
      <el-dialog title="选择数据权限" :visible.sync="dialogFormSetting">
        <el-form :model="chooseLimitform" ref="chooseLimitform">
            <el-row class="marginB20">
                <el-checkbox-group v-model="chooseLimitCheck">
                    <el-checkbox v-for="field in fields" :label="field.id" :key="field.id" style="margin-left: 0;margin-right: 10px;margin-bottom: 10px;">{{field.fieldName}}</el-checkbox>
                </el-checkbox-group>
            </el-row>            
            <el-form-item class="f-tac">
                <el-button type="primary" @click="submitFormField('chooseLimitform')">提交</el-button>
                <el-button @click="dialogFormSetting = false">取消</el-button>
            </el-form-item>
        </el-form>        
    </el-dialog>
</div>
</body>
<div th:include="_footer_include :: #jsLib"></div>
<script th:inline="javascript" >
   var moduleData=[[${moduleData}]];
   var ipListTable=[[${ipListTable}]];
   var  roleInfo=[[${roleInfo}]];
   var  iplimit=roleInfo.isIpLimit+"";
   var oldRoleName=roleInfo.roleName;
   var oldRoleId=roleInfo.id;
   var  addRoleVM=new Vue({
         el: '#addRole',
         data: function() {
            return {
                btnDisabled: false,
                isDisabled: false,
                chooseLimitCheck: [],//默认选中
                fields: [],
                checkAll1:false,//全选默认
                dataList:moduleData,
                addRoleValidateForm: {
                    roleName: roleInfo.roleName,
                    roleCode:roleInfo.roleCode,
                    visitLimitRadio:iplimit,
                },
                rules:{
                    roleName:[{ required: true, message: '角色名称不能为空'},
                    {validator:function(rule,value,callback){
                    	          if(oldRoleId&&oldRoleName==value){
                    	        	  callback();
                    	          }
                     			    var param = {'roleName':value};
                                     axios.post('/role/roleManager/qeuryRoleByName',param)
                                     .then(function (response) {
                                         var data =  response.data;
                                         if(data.code=='0'){
                                             var resData = data.data;
                                             if(resData.length>0){
                                                 callback(new Error("此角色名称已存在，请修改后提交"));
                                             }else{
                                                 callback();
                                             }
                                             
                                         }else{
                                              callback(new Error("查询角色名称是否唯一报错"));
                                         }
                                     })
                                     .catch(function (error) {
                                       console.log(error);
                                     })
                                     .then(function () {
                                       // always executed
                                     });
                     			  
                     },trigger:'blur'}
                     ]
                },
                chooseIpform: {
                	ipPackageName: '',
                    searchHasIp:'',
                    type:[]
                },
                rulesChooseIp:{
                    type:[{ type: 'array', required: true, message: '请至少选择一个IP包', trigger: 'change' }]
                },
                chooseLimitform:{

                },
                searchInput:'',
                ipListTable: ipListTable,
                dataTableIP: [],
                multipleSelection: [],
                dialogFormChooseIP: false,
                dialogFormSetting: false,
                form: {
                    name: '',
                    remark: '',
                    delivery: false,
                    type: []
                },
                formLabelWidth: '120px',
                currentPage: 1,//默认第一页,
                multipleIpSelection:[],
                checkBoxFieldArr:{},
            }             
        },
        methods: {
            submitForm(formName) {
                this.$refs[formName].validate((valid) => {
                    if (valid) {
                        alert('submit!');
                    } else {
                        console.log('error submit!!');
                        return false;
                    }
                });
            },
            reBackRoleInfo(){
            	 window.location.href="/role/roleManager/initRoleInfo"; 	
            },
            openIpPackDilog(){
             //打开IP包
               addRoleVM.dialogFormChooseIP=true;
               if (this.$refs['chooseIpform']) {
                 this.$refs['chooseIpform'].resetFields();
               }
            },
            submitFormRole(formName) {
                this.$refs[formName].validate((valid) => {
                    if (valid) {
                       	//处理角色对应操作项数据
                        var submitData=addRoleVM.dataList;
                        var  operationArry=[];
                        //设置操作权限菜单
                        var  menuArry=[];
                     	if(null!=submitData){
                     		//循环一级菜单
                     	  for(var i=0; i<submitData.length;i++)  {
                     		 var subList= submitData[i].subList;  
                     		 if(null!=subList){
                     			 //循环二级菜单
                     			  for(var j=0; j<subList.length;j++)  {
                              		  var checkedCities= subList[j].checkedCities; 
                              		  if(null!=checkedCities){
                              			 //二级菜单Id
                              			 menuArry.push(subList[j].id);
                              			//循环选中操作
                              			for(var m=0; m<checkedCities.length;m++)  {
                              				var operation={};
                              				 operation.id=checkedCities[m];
                                 			 operationArry.push(operation);  
                                 		 }
                              		   }
                              	   }
                                  } 	 
                     		 }
                          }
                     	//获取菜单的数据列
                     	var  fieldMap=addRoleVM.checkBoxFieldArr;
                         var  param={};
                         param.roleName=addRoleVM.addRoleValidateForm.roleName;
                         param.roleCode=addRoleVM.addRoleValidateForm.roleCode;
                         param.isIpLimit=addRoleVM.addRoleValidateForm.visitLimitRadio;
                         param.operations=operationArry;
                         param.ipPackages=addRoleVM.ipListTable;
                         param.id=roleInfo.id;
                         param.menuIds=menuArry;
                         param.menuFileds=fieldMap;
                         addRoleVM.btnDisabled = true;  
                         axios.post('/role/roleManager/updateRoleInfo',param).then(function (response) {
          		           if(null==response){
          		        	 addRoleVM.$message({
                                 message: "接口调用失败",
                                 type: 'error'
                               });
                                addRoleVM.btnDisabled = false;   
                                return ;
          		            }
          		            var resobj= response.data;
          		            if(null==resobj){
          		            	addRoleVM.$message({
                                    message: "接口调用失败",
                                    type: 'error'
                                  });
                                addRoleVM.btnDisabled = false;   
                                return ;
          		            } 
          		            if(resobj.code!='0'){
          		            	addRoleVM.$message({
                                    message: "接口调用失败",
                                    type: 'error'
                                  });
                                addRoleVM.btnDisabled = false;   
          		            	return ;
                              }
                              addRoleVM.btnDisabled = false;   
                              window.location.href="/role/roleManager/initRoleInfo"; 
          		            })
          		            .catch(function (error) {
                              addRoleVM.btnDisabled = false;   
          		              console.log(error);
          		            })
          		            .then(function () {
          		           });
                    } else {
                        console.log('error submit!!');
                        return false;
                    }
                });
            },
            
            resetForm(formName) {
                this.$refs[formName].resetFields();
            },
            handleClick(row) {
                console.log(row);
            },
            handleSelectionChange(val) {
                this.multipleSelection = val;
            },
            queryIpPackgeData(){
             //查询Ip包数据
                var param={};
	            var ipAddress = this.chooseIpform.searchHasIp;
	            var ipPackageName = this.chooseIpform.ipPackageName;
             	param.ipPackageName=ipPackageName;
             	param.ipAddress=ipAddress;
              	var deleId=[];
            	var ipListTable=addRoleVM.ipListTable;
            	if(null!=ipListTable&&ipListTable.length>0){
            	for (var i=0;i<ipListTable.length;i++ ) {
            		  deleId.push(ipListTable[i].id);  
            	 }
                }
             	param.deleId=deleId;
		        axios.post('/ip/ipAccess/queryPackageList',param).then(function (response) {
		           if(null==response){
		        	   addRoleVM.$message({
                           message: "接口调用失败",
                           type: 'error'
                         });
		                 return ;
		            }
		            var resobj= response.data;
		            if(null==resobj){
		            	addRoleVM.$message({
                            message: "接口调用失败",
                            type: 'error'
                          });
		                 return ;
		            } 
		            if(resobj.code!='0'){
		            	addRoleVM.$message({
                            message: "接口调用失败",
                            type: 'error'
                          });
		            	return ;
		            }
		             var pageData=resobj.data;
		           	 addRoleVM.dataTableIP =pageData.data; 
		            })
		            .catch(function (error) {
		              console.log(error);
		            })
		            .then(function () {
		            });	
            },
	    	changeIpTableFun(val) {
	    	     this.multipleIpSelection = val;
	    	 },
	    	 submitIpPackeageForm(formName) {
	    	  //选择IP包后提交数据
	           this.$refs[formName].validate((valid) => {
	                if (valid) {
	                 var ipSelectData=addRoleVM.multipleIpSelection; 
	                 addRoleVM.ipListTable=addRoleVM.ipListTable.concat(ipSelectData);
	                 addRoleVM.dialogFormChooseIP=false;
	               } else {
	                 console.log('error submit!!');
	                return false;
	              }
	           });
	           },
	            openDialogLimitData(moduleCode ,id){
		        	//打开数据权限界面
		             addRoleVM.dialogFormSetting=true;
		             var  param={};
		        	 param.menuCode=moduleCode;
		        	 addRoleVM.feildMenuId=id;
		         	 var map=addRoleVM.checkBoxFieldArr;
		         	var checkArr=[];
		         	for(var key in map){
		         		if(key==id){
		         			 console.log("属性：" + key + ",值：" + map[key]);
		         			checkArr=map[key];
		         		  }
		         		}
		             axios.post('/role/roleManager/queryCustomField',param).then(function (response) {
				           if(null==response){
				        	   addRoleVM.$message({
                                   message: "接口调用失败",
                                   type: 'error'
                                 });
				                 return ;
				            }
				            var resobj= response.data;
				            if(null==resobj){
				            	addRoleVM.$message({
                                    message: "接口调用失败",
                                    type: 'error'
                                  });
				                 return ;
				            } 
				            if(resobj.code!='0'){
				            	addRoleVM.$message({
	                                   message: "接口调用失败",
	                                   type: 'error'
	                                 });
				            	return ;
				            }
				             addRoleVM.fields=resobj.data;
				             var  fieldAray= roleInfo.customFieldMenus;
				             var  fArray=[];
				             var  menuFields= resobj.data;
				             if(checkArr.length>0){
				            	 for(var i=0;i<checkArr.length;i++){
						              for(var j=0;j<menuFields.length;j++){
						               if(menuFields[j].id==checkArr[i]){
						            	  fArray.push(menuFields[j].id);	
						              }
						             }
							      } 
				            	 
				            	 
				             }else if(null!=fieldAray){
				            	for(var i=0;i<fieldAray.length;i++){
				            	   for(var j=0;j<menuFields.length;j++){
				            	   if(menuFields[j].id==fieldAray[i].customFieldId){
				            		   fArray.push(menuFields[j].id);	
				            	   }
				            	 }
					            } 
				              }
				              addRoleVM.chooseLimitCheck=fArray;
				            })
				            .catch(function (error) {
				              console.log(error);
				            })
				            .then(function () {
				            });	 
		            },
		           //提交数据权限
		           submitFormField(form){
		            	Vue.set(this.checkBoxFieldArr,addRoleVM.feildMenuId,addRoleVM.chooseLimitCheck);
		                addRoleVM.dialogFormSetting=false;	
		          },
		          //自动勾选自定义字段
	                limitData(moduleCode ,id){
	                    
	                    var  param={};
	                    param.menuCode=moduleCode;
	                    axios.post('/role/roleManager/queryCustomField',param).then(function (response) {
	                           var resobj= response.data;
	                           if(null==resobj||resobj.code!='0'){
	                               addRoleVM.$message({
	                                   message: "接口调用失败",
	                                   type: 'error'
	                                 }); 
	                               return ;
	                           } 
	                            addRoleVM.fields=resobj.data;
	                             var  fieldAray= resobj.data;
	                             var fArray=[];
	                           //获取菜单是否已选择
	                          
	                            //默认全部选中
	                              if(null!=fieldAray){
	                                for(var i=0;i<fieldAray.length;i++){
	                                   fArray.push(fieldAray[i].id);
	                                 }
	                              Vue.set(addRoleVM.checkBoxFieldArr,id,fArray);
	                               }
	                           })
	                           .catch(function (error) {
	                             console.log(error);
	                           })
	                           .then(function () {
	                           });  
	                   },
            // 删除
            deleteFun() {
                this.$confirm('删除后此角色信息将不存在，确认删除吗？', '消息提醒', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    this.$message({
                        type: 'success',
                        message: '删除成功!'
                    });
                }).catch(() => {
                    this.$message({
                        type: 'info',
                        message: '已取消删除'
                    });          
                });
            },
            // 分页
            handleSizeChange(val) {
                console.log(`每页 ${val} 条`);
            },
            handleCurrentChange(val) {
                console.log(`当前页: ${val}`);
            },
            deleteRow(index, rows) {
                rows.splice(index, 1);
            },
            fold: function (item) {
                if (typeof item.folded === "undefined") {
                    this.$set(item, "folded", true);
                } else {
                    item.folded = !item.folded;
                }
            },
            // 全选一项
            handleCheckAllChange(item, subList) {
                console.log(item)
                console.log(subList)
                var arr = [];
                for (var a = 0; a < subList.operationInfos.length; a++) {
                    arr.push(subList.operationInfos[a].id)
                }
                if (typeof subList.checkedCities === "undefined") {
                    this.$set(subList, "checkedCities", arr);
                }
                // subList.checkedCities = event.target.checked ? arr : [];
                subList.checkedCities = subList.checkAll ? arr : [];
                if (typeof subList.checkAll === "undefined") {
                    this.$set(subList, "checkAll", true);
                }
                var secondAllSelect = item.subList.every((item) => item.checkAll);
                if (secondAllSelect) {
                    item.firstCheckAll = true;
                } else {
                    item.firstCheckAll = false;
                }
                this.limitData(subList.authCode,subList.id);
                this.checkAllSelect();
            },
            // 单选
            handleCheckedCitiesChange(item, subList) {
                var checkedCount = subList.checkedCities.length;
                if (typeof subList.checkAll === "undefined") {
                    this.$set(subList, "checkAll", false);
                }
                subList.checkAll = checkedCount === subList.operationInfos.length;
                var secondAllSelect = item.subList.every((item) => item.checkAll);
                if (secondAllSelect) {
                    item.firstCheckAll = true;
                } else {
                    item.firstCheckAll = false;
                }
                this.checkAllSelect();
            },
            // 点击所有
            checkSecondAll: function (item) {
                if (typeof item.firstCheckAll === "undefined") {
                    this.$set(item, "firstCheckAll", true);
                }
                for (var a = 0; a < item.subList.length; a++) {
                    this.checkItemAll(item.firstCheckAll, item.subList[a])
                }
                // item.isIndeterminate=false
            },
            checkItemAll: function (flag, item) {
                var arr = [];
                for (var a = 0; a < item.operationInfos.length; a++) {
                    arr.push(item.operationInfos[a].id)
                }
                if (typeof item.checkedCities === "undefined") {
                    this.$set(item, "checkedCities", arr);
                }
                item.checkedCities = flag ? arr : [];
                item.checkAll = flag;
                this.limitData(item.authCode,item.id);
                this.checkAllSelect();
            },
            
            // 没有二级菜单
            handleOneCheckedCitiesChange:function (item) {
                var checkedCount = item.checkedCities.length;
                if (typeof item.checkAll === "undefined") {
                    this.$set(item, "checkAll", false);
                }
                item.checkAll = checkedCount === item.operationInfos.length;
                this.checkAllSelect();
            },
            handleOneCheckAll:function (event,item) {
                var arr = [];
                for (var a = 0; a < item.operationInfos.length; a++) {
                    arr.push(item.operationInfost[a].id)
                }

                item.checkedCities = event.target.checked ? arr : [];
                this.checkAllSelect();
            },
            visitLimitRadioChange(value) {
                if(value==1){
                    this.isDisabled=true
                }else{
                    this.isDisabled=false
                }
            },
            handleCheckAllChange1(val) {
                this.dataList.forEach((item) => {
                    if (!item.subList) {
                        item.checkAll = val;
                        this.handleOneCheckAll(item);
                    } else {
                        item.firstCheckAll = val;
                        this.checkSecondAll(item);
                        item.subList.forEach((innerItem) => {
                            innerItem.checkAll = val;
                        })
                    }
                })
            },
            // 校验单选和多选关联
            checkAllSelect() {
                var flag = true;
                this.dataList.forEach((item) => {
                    if (!(item.firstCheckAll || item.checkAll)) {
                        flag = false;
                    }
                });
                this.checkAll1 = flag;
            }
        },
        created(){
          if(iplimit=="1"){
            this.isDisabled=true;
          }          
        },
        mounted(){
            document.getElementById('addRole').style.display = 'block';
        }
       
    })
</script>
</html>